<form id="edit-form" class="form-horizontal" style="position:relative;background: #fff" role="form" data-toggle="validator" method="POST" action="">
    <input type="hidden" name="row[id]" value="{$row.id}" />
    <input TYPE="hidden" id="row" NAME="data" VALUE='{$row|json_encode|htmlentities}'/>
    <div class="panel-body">
        <!-- 选项卡导航 -->
        <ul class="nav nav-tabs" role="tablist">
            <li role="presentation" class="active">
                <a href="#tab-carousel" aria-controls="tab-carousel" role="tab" data-toggle="tab">
                    <i class="fa fa-images"></i> 轮插图
                </a>
            </li>
            <li role="presentation">
                <a href="#tab-title" aria-controls="tab-title" role="tab" data-toggle="tab">
                    <i class="fa fa-font"></i> Logo图
                </a>
            </li>
        </ul>

        <!-- 选项卡内容 -->
        <div class="tab-content" style="margin-top: 20px;">
            <!-- 轮插图选项卡 -->
            <div role="tabpanel" class="tab-pane fade active in" id="tab-carousel">
                <div class="form-group">
                    <label for="c-title" class="control-label col-xs-12 col-sm-2">轮播图标题:</label>
                    <div class="col-xs-12 col-sm-8" id="div-title" >
                        <input type="text" id="c-title" name="row[title]" value="{$row.title}" class="form-control" title="title"  placeholder="" data-rule=""  data-tip="轮播图标题"  />
                    </div>
                </div>

                <div class="form-group">
                    <label for="c-number" class="control-label col-xs-12 col-sm-2">位置描述:</label>
                    <div class="col-xs-12 col-sm-8" id="div-number">
                        <label for="c-number" class="control-label col-xs-12 col-sm-2"></label>
                        <div style="margin-top:-2px">
                            <select id="c-number" data-rule="require" class="form-control" name="row[number]">
                            </select>
                        </div>
                    </div>
                </div>

                <div class="form-group">
                    <label for="c-cityarea_id" class="control-label col-xs-12 col-sm-2">行政区划:</label>
                    <div class="col-xs-12 col-sm-8" id="div-cityarea_id">
                        <div style="margin-top:-2px;margin-left: -2px;">
                            <select id="c-cityarea_id" id="province" class="form-control liandong"
                                    name="row[province_id]"
                                    type="text" value="">

                            </select>
                            <select id="city" class="form-control liandong" name="row[city_id]"
                                    type="text" value="0">

                            </select>
                            <select id="county" class="form-control liandong" name="row[district_id]"
                                    type="text" value="">

                            </select>
                        </div>
                    </div>
                </div>


                <div class="form-group">
                    <label for="c-school_id" class="control-label col-xs-12 col-sm-2">学校:</label>
                    <div class="col-xs-12 col-sm-8" id="div-school_id">
                        <select id="c-school_id" data-rule="require" class="form-control select" name="row[school_id]" data-default="{$row.school_id}">
                            <option value="0">请选择学校</option>
                        </select>
                    </div>
                </div>

                <div class="form-group">
                    <label for="c-communityCourse_id" class="control-label col-xs-12 col-sm-2">社区学科:</label>
                    <div class="col-xs-12 col-sm-8" id="div-communityCourse_id">
                        <select id="c-communityCourse_id" data-rule="require" class="form-control select" name="row[communityCourse_id]" data-default="{$row.communityCourse_id}">
                            <option value="">请选择学科</option>
                        </select>
                    </div>
                </div>

                <div class="form-group">
                    <label for="c-ocation_id" class="control-label col-xs-12 col-sm-2">教学点:</label>
                    <div class="col-xs-12 col-sm-8" id="div-ocation_id">
                        <select id="c-ocation_id" data-rule="require" class="form-control select" name="row[ocation_id]" data-default="{$row.classes_id}">
                            <option value="">请选择教学点</option>
                        </select>
                    </div>
                </div>

                <div class="form-group">
                    <label for="c-ocation_id_sq" class="control-label col-xs-12 col-sm-2">社区教学点:</label>
                    <div class="col-xs-12 col-sm-8" id="div-ocation_id_sq">
                        <select id="c-ocation_id_sq" data-rule="require" class="form-control select" name="row[ocation_id]" data-default="{$row.classes_id}">
                            <option value="">请选择社区教学点</option>
                        </select>
                    </div>
                </div>

                <div class="form-group">
                    <label for="c-classes_id" class="control-label col-xs-12 col-sm-2">班级:</label>
                    <div class="col-xs-12 col-sm-8" id="div-classes_id">
                        <select id="c-classes_id" data-rule="require" class="form-control select" name="row[classes_id]" data-default="{$row.classes_id}">
                            <option value="">请选择班级</option>
                        </select>
                    </div>
                </div>

                <div class="form-group">
                    <label for="c-image-width" class="control-label col-xs-12 col-sm-2">图片宽度:</label>
                    <div class="col-xs-12 col-sm-8">
                        <input id="c-image-width" class="form-control" name="row[image_width]" readonly type="number" value="{$row.image_width}" placeholder="请输入图片宽度（像素）" min="1" step="1">
                    </div>
                </div>

                <div class="form-group">
                    <label for="c-image-height" class="control-label col-xs-12 col-sm-2">图片高度:</label>
                    <div class="col-xs-12 col-sm-8">
                        <input id="c-image-height" class="form-control" name="row[image_height]" readonly type="number" value="{$row.image_height}" placeholder="请输入图片高度（像素）" min="1" step="1">
                    </div>
                </div>

                <div class="form-group">
                    <label for="c-content" class="control-label col-xs-12 col-sm-2">内容:</label>
                    <div class="col-xs-12 col-sm-8" id="div-content" >
                        <textarea name="row[content]" id="editor-content" class="form-control editor" data-rule="" rows="5" data-tip="内容" >{$row.content}</textarea>
                    </div>
                </div>

                <div class="form-group">
                    <label for="c-type" class="control-label col-xs-12 col-sm-2">轮插效果:</label>
                    <div class="col-xs-12 col-sm-8" id="div-type" >
                       <select name="row[type]" id="c-type"  class="form-control selectpicker"  data-rule="" data-tip="轮插效果" >
                           <option value="1" {if $row["type"]=="1"} selected{/if}>右到左滑动</option>
                           <option value="2" {if $row["type"]=="2"} selected{/if}>上到下滑动</option>
                       </select>
                    </div>
                </div>

                <div class="form-group">
                    <label class="control-label col-xs-12 col-sm-2">图片管理:</label>
                    <div class="col-xs-12 col-sm-8">
                        <div class="panel">
                            <div class="panel-heading">
                                <h4 class="panel-title">
                                    <i class="fa fa-images"></i> 轮播图片设置
                                    <small class="text-muted">（最多可添加5张图片）</small>
                                </h4>
                            </div>
                            <div class="panel-body" style="padding:15px 20px;">
                                <div id="slider-images-container">
                                    <!-- 动态生成的图片组将在这里显示 -->
                                </div>

                                <!-- 添加图片按钮 -->
                                <div class="text-center" style="margin-top: 15px;">
                                    <button type="button" id="add-image-group" class="btn btn-success">
                                        <i class="fa fa-plus"></i> 添加图片
                                    </button>
                                    <small class="text-muted">（已添加 <span id="image-count">0</span> / 5 张图片）</small>
                                </div>

                                <!-- 隐藏字段存储JSON数据 -->
                                <input type="hidden" id="c-image" name="row[image]" value="{$row.image|htmlentities}" />
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 头图选项卡 -->
            <div role="tabpanel" class="tab-pane fade" id="tab-header">
                <div class="form-group">
                    <label for="c-header-title" class="control-label col-xs-12 col-sm-2">头图标题:</label>
                    <div class="col-xs-12 col-sm-8">
                        <input type="text" id="c-header-title" name="row[header_title]" value="{$row.header_title|default=''}" class="form-control" placeholder="请输入头图标题" data-tip="头图标题" />
                    </div>
                </div>

                <div class="form-group">
                    <label for="c-header-image" class="control-label col-xs-12 col-sm-2">头图图片:</label>
                    <div class="col-xs-12 col-sm-8">
                        <div class="input-group">
                            <input id="c-header-image" class="form-control" name="row[header_image]" type="text" value="{$row.header_image|default=''}" placeholder="请选择头图图片">
                            <div class="input-group-btn">
                                <button type="button" id="plupload-header-image" class="btn btn-danger plupload" data-input-id="c-header-image" data-mimetype="image/*" data-multiple="false" data-preview-id="p-header-image">
                                    <i class="fa fa-upload"></i> {:__('Upload')}
                                </button>
                            </div>
                        </div>
                        <ul class="row list-inline plupload-preview" id="p-header-image"></ul>
                    </div>
                </div>

                <div class="form-group">
                    <label for="c-header-link" class="control-label col-xs-12 col-sm-2">头图链接:</label>
                    <div class="col-xs-12 col-sm-8">
                        <input type="text" id="c-header-link" name="row[header_link]" value="{$row.header_link|default=''}" class="form-control" placeholder="请输入头图链接地址" data-tip="头图链接" />
                    </div>
                </div>

                <div class="form-group">
                    <label for="c-header-description" class="control-label col-xs-12 col-sm-2">头图描述:</label>
                    <div class="col-xs-12 col-sm-8">
                        <textarea name="row[header_description]" id="c-header-description" class="form-control" rows="3" placeholder="请输入头图描述" data-tip="头图描述">{$row.header_description|default=''}</textarea>
                    </div>
                </div>
            </div>

            <!-- 标题图选项卡 -->
            <div role="tabpanel" class="tab-pane fade" id="tab-title">
                <div class="form-group">
                    <label for="c-logo-title" class="control-label col-xs-12 col-sm-2">Logo标题:</label>
                    <div class="col-xs-12 col-sm-8">
                        <input type="text" id="c-logo-title" name="row[logo_title]" value="{$row.logo_title|default=''}" class="form-control" placeholder="请输入Logo标题" data-tip="Logo标题" />
                    </div>
                </div>

                <div class="form-group">
                    <label for="c-title-image" class="control-label col-xs-12 col-sm-2">Logo图片:</label>
                    <div class="col-xs-12 col-sm-8">
                        <div class="input-group">
                            <input id="c-title-image" class="form-control" name="row[title_image]" type="text" value="{$row.title_image|default=''}" placeholder="请选择Logo图片">
                            <div class="input-group-btn">
                                <button type="button" id="plupload-title-image" class="btn btn-danger plupload" data-input-id="c-title-image" data-mimetype="image/*" data-multiple="false" data-preview-id="p-title-image">
                                    <i class="fa fa-upload"></i> {:__('Upload')}
                                </button>
                            </div>
                        </div>
                        <ul class="row list-inline plupload-preview" id="p-title-image"></ul>
                    </div>
                </div>

                <div class="form-group">
                    <label for="c-logo-width" class="control-label col-xs-12 col-sm-2">Logo宽度:</label>
                    <div class="col-xs-12 col-sm-8">
                        <input id="c-logo-width" class="form-control" name="row[logo_width]" type="number" value="{$row.logo_width|default='200'}" placeholder="请输入Logo宽度（像素）" min="1" step="1">
                    </div>
                </div>

                <div class="form-group">
                    <label for="c-logo-height" class="control-label col-xs-12 col-sm-2">Logo高度:</label>
                    <div class="col-xs-12 col-sm-8">
                        <input id="c-logo-height" class="form-control" name="row[logo_height]" type="number" value="{$row.logo_height|default='200'}" placeholder="请输入Logo高度（像素）" min="1" step="1">
                    </div>
                </div>

                <div class="form-group">
                    <label for="c-logo-position" class="control-label col-xs-12 col-sm-2">Logo位置:</label>
                    <div class="col-xs-12 col-sm-8">
                        <select name="row[logo_position]" id="c-logo-position" class="form-control selectpicker" data-tip="Logo显示位置">
                            <option value="top-left" {if $row["logo_position"]=="top-left"} selected{/if}>左上角</option>
                            <option value="top-center" {if $row["logo_position"]=="top-center"} selected{/if}>顶部居中</option>
                            <option value="top-right" {if $row["logo_position"]=="top-right"} selected{/if}>右上角</option>
                            <option value="center" {if $row["logo_position"]=="center"} selected{/if}>居中</option>
                            <option value="bottom-left" {if $row["logo_position"]=="bottom-left"} selected{/if}>左下角</option>
                            <option value="bottom-center" {if $row["logo_position"]=="bottom-center"} selected{/if}>底部居中</option>
                            <option value="bottom-right" {if $row["logo_position"]=="bottom-right"} selected{/if}>右下角</option>
                        </select>
                    </div>
                </div>

                <div class="form-group">
                    <label for="c-logo-link" class="control-label col-xs-12 col-sm-2">Logo链接:</label>
                    <div class="col-xs-12 col-sm-8">
                        <input type="text" id="c-logo-link" name="row[logo_link]" value="{$row.logo_link|default=''}" class="form-control" placeholder="请输入Logo点击链接地址" data-tip="Logo链接" />
                    </div>
                </div>

                <div class="form-group">
                    <label class="control-label col-xs-12 col-sm-2">显示Logo:</label>
                    <div class="col-xs-12 col-sm-8" id="div-show-logo">
                        <input id="c-show-logo" name="row[show_logo]" type="hidden" value="{$row.show_logo|default='1'}">
                        <a href="javascript:;" data-toggle="switcher" class="btn-switcher {if $row.show_logo=='1'}active{else}text-gray{/if}" data-input-id="c-show-logo" data-yes="1" data-no="0">
                            <i class="fa fa-toggle-on fa-2x {if $row.show_logo!='1'}fa-flip-horizontal{/if}"></i>
                        </a>
                        <div data-favisible="switch=1" class="p-3">显示</div>
                        <div data-favisible="switch=0" class="p-3">隐藏</div>
                    </div>
                </div>
            </div>
        </div>

        <!-- 提交按钮 -->
        <div class="form-group layer-footer">
            <label class="control-label col-xs-12 col-sm-2"></label>
            <div class="col-xs-12 col-sm-8">
                <button type="submit" class="btn btn-success btn-embossed disabled">{:__('OK')}</button>
                <button type="reset" class="btn btn-default btn-embossed">{:__('Reset')}</button>
            </div>
        </div>
    </div>
</form>

